<template>
  <div class="install">
    <Vheader title="修改绑定手机"></Vheader>
    <section class="main">
      <div class="input-box">
        <label class="input-label flex2">手机号:</label>
        <input type="number" class="input flex8" placeholder="请输入手机号码" v-model="mobile">
        <btnTimer @getCode="send" :disabled="disabled" ref="btn" :second="60" :tel="mobile"></btnTimer>
      </div>
      <div class="input-box">
        <label class="input-label flex2">验证码:</label>
        <input type="number" class="input flex8" placeholder="请输入手机验证码" v-model="code">
      </div>
      <mt-button @click.native="updateMobile" type="primary" class="exit">确认</mt-button>
    </section>
  </div>
</template>

<script>
  import btnTimer from '../../components/btnTimer'
  import Vheader from '../../components/header'
  import {Toast} from 'mint-ui';
  import axios from '../../axios/axios'
  export default{
    data() {
      return {
        disabled: false,
        mobile: '',
        code: ''
      };
    },
    methods: {
      updateMobile() {
        var that=this;
        var code = JSON.stringify({
          'data': [this.mobile, this.code, 'register'],
          'controllerName': 'smsMessage',
          'actionName': 'validate'
        });
        var mobile = JSON.stringify({
          'data': [{
            'mobile': this.mobile
          }],
          'controllerName': 'userInfo',
          'actionName': 'update'
        });
        if (this.code === '' || this.code.length < 4) {
          Toast('验证码不能为空或者长度不小于四位');
          return;
        }
        axios.postAdmain({
          data:code,
          callback(res){
            if (res.data.data.result === true) {
              axios.postAdmain({
                data:mobile,
                callback(response){
                  if (response.data.data.result === true) {
                    Toast('修改成功');
                    that.$router.push('/my');
                    console.log(response.data);
                  }
                }
              })
            }
          }
        });
      },
      send: function () {
        this.disabled = true;
        setTimeout(this.sended, 2000);
      },
      sended() {
        this.$refs.btn.getCode();
        this.disabled = false;
      }
    },
    components: {
      btnTimer,Vheader
    }
  };
</script>
<style type="text/scss" lang="scss" scoped>
  @import "../../common/style/public";

</style>







